/**
 * Created with  SublimeText
 * @Author:      Lyle
 * @DateTime:    2016-12-27 22:44:48
 * @Description: 
 */
import React, { Component } from 'react'
import { Router, Route, Link } from 'react-router'

class RockTree extends Component {

    constructor(props) {
        super(props);
        console.log('RockTree', props);
        this.state = {
            tree: this.props.data
        };
    }

    createChildrenNode(data) {
        let items = [];
        if (data) {
            for (var i in data) {
                let className = 'treeMenu1',
                    url = data[i].url,
                    gotoUrl = "/" + data[i].name;
                if (this.props.centerState.childModuleName == data[i].url) {
                    className = "treeMenu1 treeAction";
                }
                items.push(<div key={i} onClick={() => this.gotoModules(url)} className={className} data-custom-url = {data[i].url} >
                    <Link to={gotoUrl} >{data[i].name}</Link>
                    </div>);
            }
        }
        return items;
    }

    switchMenu(i) {
        let data = this.state.tree;
        data[i].open = this.state.tree[i].open ? false : true;
        this.setState({ tree: data });
    }

    gotoModules(name) {
        console.log('gotoModules', name);
        //this.props.setChildModuleName(name);
    }

    createTreeNode(data) {
        let items = [];
        for (var i in data) {
            let classMenu = data[i].open ? 'treeMenuChildren openMenu' : 'treeMenuChildren closeMenu';
            let classMenuBox = data[i].open ? 'treeMenuBox treeMenuAction' : 'treeMenuBox';
            let index = i;
            items.push(<div key={i} className={classMenuBox}> 
                            <div className='treeMenu0' onClick={() => this.switchMenu(parseInt(index))}>{data[i].name}</div>
                            <div className = {classMenu}>{this.createChildrenNode(data[i].children)}</div> 
                       </div>);
        }
        return items;
    }

    render() {
        let tree = this.createTreeNode(this.state.tree);
        return (
            <div className='RockTree'>
                {tree}
            </div>
        )
    }

}

export default RockTree;
